<!DOCTYPE HTML>
<html>

    <head>
        <!--图标-->
        <link rel="icon" href="100years.ico" type="image/x-icon" />
        <!--JQuery-->
        <script src="https://cdn.staticfile.org/jquery/1.12.4/jquery.min.js"></script>
        <!--自适应代码-->
        <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
        
        <!--BootSrap CSS-->
        <link rel="stylesheet" href="https://cdn.staticfile.org/bootstrap/5.1.1/css/bootstrap.min.css">
        <!--自定义 CSS-->
        <link rel="stylesheet" type="text/css" href="css/main.css" />

        <!--BootSrap JS-->
        <script src="https://cdn.staticfile.org/bootstrap/5.1.1/js/bootstrap.bundle.js"></script>
        <script src="https://cdn.staticfile.org/bootstrap/5.1.1/js/bootstrap.min.js"></script>

        <!--Foundation JS-->
        <script src="https://cdn.staticfile.org/foundation/6.7.3/js/foundation.min.js"></script>
        
        <!--自定义 JS-->
        <script src="javascript/mainFunctions.js"></script>

        <meta charset="utf-8">
        <title>共产党百年荣耀</title>
    </head>

    <body>

        <!--音乐-->
        <div class="music">
            <audio id="bgm" src="BGM.mp3" autoplay="autoplay" loop preload type="audio/mpeg"></audio>
        </div>

        <!--首页图片-->
        <div class="image">
            <img src="img/100years.png">
        </div>
        <br>

        <!--共产党简介-->
        <div class="word">
            <h1 class="title" id="t_info">中国共产党简介</h1>
            <article class="article" id="w_info">
                <p id="p_info"></p>
            </article>
        </div>
        <br>

        <!--党的历史-->
        <div class="word">
            <h1 class="title" id="t_history">党的领导下</h1>
            <article class="article" id="w_history">
                <p id="p_hs1"></p>
                <p id="p_hs2"></p>
                <p id="p_hs3"></p>
                <p id="p_hs4"></p>
                <p id="p_hs5"></p>
                <p id="p_hs6"></p>
            </article>
        </div>
        <br>

        <!--国家的成就-->
        <div class="word">
            <h1 class="title" id="t_achieve">国家的成就</h1>
            <article class="article" id="w_achieve">
                <h2>两弹一星</h2>
                <p id="p_ach1"></p>
                <h2>杂交水稻</h2>
                <p id="p_ach2"></p>
                <h2>载人航天</h2>
                <p id="p_ach3"></p>
                <h2>中国"天眼"</h2>
                <p id="p_ach4"></p>
                <h2>"蛟龙"深潜</h2>
                <p id="p_ach5"></p>
                <h2>"神威"计算</h2>
                <p id="p_ach6"></p>
                <h2>东风导弹</h2>
                <p id="p_ach7"></p>
                <h2>"辽宁"航母</h2>
                <p id="p_ach8"></p>
            </article>
        </div>
        <br>

        <!--寄语-->
        <div class="word">
            <h1 class="title" id="t_message">结束语</h1>
            <article class="article" id="w_message">
                <P id="p_ms1"></P>
            </article>
        </div>

        <div id="toTop">
            <img src="img/totop.png" class="returntop_img">
        </div>

        <script src="javascript/docs.js"></script>
    </body>

</html>